
/**
 * @class Drag&Drop for direct relations.
 * @param {E.Dom} dom  The DOM element to drag.
 * @param {element} sensor  The DOM element to start dragging.
 * @param {element} left  The left panel for relations.
 * @param {element} right The right panel for relations.
 * @constructor
 */
function RelationDragSource(dom, sensor, left, right, rel) {
  RelationDragSource._super.call(this, dom, sensor);
  this.left = left;
  this.right = right;
  if (navigator.userAgent.indexOf("MSIE") > 0) {
    this.left.firstChild.style.height = "100%";
    this.right.firstChild.style.height = "100%";
  }
  this.rel = rel;
}
Object.extend("RelationDragSource", "E.DragSource");

RelationDragSource.prototype.createDrag = function(anchorV) {
  return new RelationDragView(this, anchorV);
}


function RelationDragView(dragSource, anchorV) {
  RelationDragView._super.call(this, dragSource, anchorV);
  var t = document.createElement("div");
  t.className = "dragState";
  document.body.appendChild(t);
  this.dragState = Dom(t);
}
Object.extend("RelationDragView", "E.DragView");

RelationDragView.prototype.onDragStart = function(evn) {
	RelationDragView._super.prototype.onDragStart.call(this, evn);
	this.dom.setTooltip(false);
	this.dom.removeStyleClass("relHover");
	this.draft.setOpacity(0.3);
	this.source.box.setOpacity(0.3);
}

RelationDragView.prototype.onDrag = function(v, evn) {
	var x = v[0];
	var e = this.dom.element;
  var row = e.firstChild.firstChild;
  var p = this.getCurrentPanel();
  var c = row.firstChild.firstChild;
  if ((p == this.source.left) && c && (c.className.indexOf("item") >= 0)) {
    row.appendChild(row.firstChild);
    x -= row.firstChild.offsetWidth;
    this.repositionAnchor([row.firstChild.offsetWidth, 0]);
    row = this.draft.element.firstChild.firstChild;
    row.appendChild(row.firstChild);
    this.draft._switched = !this.draft._switched;
  }
  if ((p == this.source.right) && (!c || (c.className.indexOf("item") < 0))) {
    row.appendChild(row.firstChild);
    x += row.firstChild.offsetWidth;
    this.repositionAnchor([-row.firstChild.offsetWidth, 0]);
    row = this.draft.element.firstChild.firstChild;
    row.appendChild(row.firstChild);
    this.draft._switched = !this.draft._switched;
  }
  
  if (evn.ctrlKey || evn.shiftKey) {
  	this.setState((evn.shiftKey)?"move":"copy");
  }
  else {
  	// reorder
	  var sL = this.source.left.offsetWidth;
	  var sR = this.source.right.offsetLeft;
	  if (x < -sR)
	    x = -sR;
	  if (x >= sR)
	    x = sR - 1;
	  if (((x > 0) && (this.startV[0] > sL)) || ((x < 0) && (this.startV[0] < sL)))
	    x = 0;
	  v[0] = x;
    this.setState("reorder");
  }
	  
  return true;
}

RelationDragView.prototype.onDrop = function(v, evn) {
  var p = this.getCurrentPanel();
  if (!p)
    return false;
  if (!evn.ctrlKey && !evn.shiftKey) {
    var e = this.draft.element;
	  var group = (p == this.source.right)?"main":"sys";
	  var relId = this.getRel(e).id;
	  var next = null;
	  if (e.nextSibling)
	    next = this.getRel(e.nextSibling).id;
	  var a = new ReorderAction(relId, group, next);
	  a.perform();
	  a.close();
	  var d = this.source.box.element;
	  if (this.draft._switched)
	    d.firstChild.firstChild.appendChild(d.firstChild.firstChild.firstChild);
	  e.parentNode.replaceChild(d, e);
  }
	this.dragState.hide();
  this.source.box.setOpacity(1.0);
  this.source.box.show();
  return true;
}

RelationDragView.prototype.onKeyDown = function(evn) {
  if (evn.ctrlKey || evn.shiftKey)
  	this.setState((evn.shiftKey)?"move":"copy");
  else
    this.setState("reorder");
	RelationDragView._super.prototype.onKeyDown.call(this, evn);
}

RelationDragView.prototype.onKeyUp = function(evn) {
  this.setState("reorder");
}

RelationDragView.prototype.onCancel = function(evn) {
	this.dragState.hide();
  this.source.box.setOpacity(1.0);
  this.source.box.show();
  return true;
}

RelationDragView.prototype.setState = function(state) {
	if ("reorder" == state) {
	  this.dragState.hide();
	  this.showDropDraft();
	  this.dom.setOpacity(0.8);
    this.draft.show();
	  this.source.box.hide();
	}
	else {
		this.dragState.element.innerHTML = state;
		this.dragState.show("block");
    this.dom.setOpacity(0.5);
    this.draft.hide();
	  this.source.box.show();
	}
}

RelationDragView.prototype.showDropDraft = function() {
	if (!this.dom)
	  return;
	var e = this.dom.element;
  var p = this.getCurrentPanel();
  if (!p)
    return;
  var t = e.offsetTop + (e.offsetHeight / 2);
  for (var i = 0; i < p.firstChild.childNodes.length; ++i) {
    var n = p.firstChild.childNodes[i];
    if (n == e)
      continue;
    var d = t - n.offsetTop - (n.offsetHeight / 2);
    if (d < 0) {
      if (n != this.draft.element)
        p.firstChild.insertBefore(this.draft.element, n);
      return;
    }
  }
  p.firstChild.appendChild(this.draft.element);
}

RelationDragView.prototype.getCurrentPanel = function() {
  var TOLERANCE = 50;
  var e = this.dom.element;
  if (e.offsetLeft > (this.source.left.offsetWidth - TOLERANCE))
    return this.source.right;
  else if ((e.offsetLeft + e.offsetWidth) < (this.source.right.offsetLeft + TOLERANCE))
    return this.source.left;
  else
    return null;
}

RelationDragView.prototype.getRel = function(dom) {
	if (!dom)
	  dom = this.dom.element;
  var r = dom.firstChild.firstChild;
  var c = r.childNodes[0].firstChild;
  if (c && (c.className.indexOf("rel1") >= 0))
    return c;
  return r.childNodes[1].firstChild;
}

